/************************************************************************
 *************************************************************************
 @Name :       	jRating - jQuery Plugin
 @Revison :    	2.3
 @Date : 		07/09/2012
 @Author:     	 ALPIXEL - (www.myjqueryplugins.com - www.alpixel.fr)
 @License :		 Open Source - MIT License : http://www.opensource.org/licenses/mit-license.php

 **************************************************************************
 *************************************************************************/
(function($) {
    $.fn.jRating = function(op) {
        var defaults = {
            /** String vars **/
            bigStarsPath : '/img/stars.png', // path of the icon stars.png
            smallStarsPath : '/img/small.png', // path of the icon small.png
            action : convertURL('EvaluateAjax.action'),
//            phpPath : 'php/jRating.php', // path of the php file jRating.php
            type : 'big', // can be set to 'small' or 'big'

            /** Boolean vars **/
            step:false, // if true,  mouseover binded star by star,
            isDisabled:false,
            showRateInfo: true,

            /** Integer vars **/
            length:5, // number of star to display
            decimalLength : 0, // number of decimals.. Max 3, but you can complete the function 'getNote'
            rateMax : 5, // maximal rate - integer from 0 to 9999 (or more)
            rateInfosX : -45, // relative position in X axis of the info box when mouseover
            rateInfosY : 5, // relative position in Y axis of the info box when mouseover

            /** Functions **/
            onSuccess : null,
            onError : null
        };

        if(this.length>0)
            return this.each(function() {
                var opts = $.extend(defaults, op),
                    newWidth = 0,
                    starWidth = 0,
                    starHeight = 0,
                    bgPath = '';

                if($(this).hasClass('jDisabled') || opts.isDisabled)
                    var jDisabled = true;
                else
                    var jDisabled = false;

                getStarWidth();
                $(this).height(starHeight);

                var average = parseFloat($(this).attr('id').split('_')[0]),
                    idBox = parseInt($(this).attr('id').split('_')[1]), // get the id of the box
                    widthRatingContainer = starWidth*opts.length, // Width of the Container
                    widthColor = average/opts.rateMax*widthRatingContainer, // Width of the color Container

                    quotient =
                        $('<div>',
                            {
                                'class' : 'jRatingColor',
                                css:{
                                    width:widthColor
                                }
                            }).appendTo($(this)),

                    average =
                        $('<div>',
                            {
                                'class' : 'jRatingAverage',
                                css:{
                                    width:0,
                                    top:- starHeight
                                }
                            }).appendTo($(this)),

                    jstar =
                        $('<div>',
                            {
                                'class' : 'jStar',
                                css:{
                                    width:widthRatingContainer,
                                    height:starHeight,
                                    top:- (starHeight*2),
                                    background: 'url('+bgPath+') repeat-x'
                                }
                            }).appendTo($(this));


                $(this).css({width: widthRatingContainer,overflow:'hidden',zIndex:1,position:'relative'});

                if(!jDisabled)
                    $(this).unbind().bind({
                        mouseenter : function(e){
                            var realOffsetLeft = findRealLeft(this);
                            var relativeX = e.pageX - realOffsetLeft;
                            if (opts.showRateInfo)
                                var tooltip =
                                    $('<p>',{
                                        'class' : 'jRatingInfos',
                                        html : getNote(relativeX)+' <span class="maxRate">/ '+opts.rateMax+'</span>',
                                        css : {
                                            top: (e.pageY + opts.rateInfosY),
                                            left: (e.pageX + opts.rateInfosX)
                                        }
                                    }).appendTo('body').show();
                        },
                        mouseover : function(e){
                            $(this).css('cursor','pointer');
                        },
                        mouseout : function(){
                            $(this).css('cursor','default');
                            average.width(0);
                        },
                        mousemove : function(e){
                            var realOffsetLeft = findRealLeft(this);
                            var relativeX = e.pageX - realOffsetLeft;
                            if(opts.step) newWidth = Math.floor(relativeX/starWidth)*starWidth + starWidth;
                            else newWidth = relativeX;
                            average.width(newWidth);
                            if (opts.showRateInfo)
                                $("p.jRatingInfos")
                                    .css({
                                        left: (e.pageX + opts.rateInfosX)
                                    })
                                    .html(getNote(newWidth) +' <span class="maxRate">/ '+opts.rateMax+'</span>');
                        },
                        mouseleave : function(){
                            $("p.jRatingInfos").remove();
                        },
                        click : function(e){
                            var element = this;
                            $(this).unbind().css('cursor','default').addClass('jDisabled');
                            if (opts.showRateInfo) $("p.jRatingInfos").fadeOut('fast',function(){$(this).remove();});
                            e.preventDefault();
                            var rate = getNote(newWidth);
                            average.width(newWidth);

                            /** ONLY FOR THE DEMO, YOU CAN REMOVE THIS CODE **/
/*                            $('.datasSent p').html('<strong>idBox : </strong>'+idBox+'<br /><strong>rate : </strong>'+rate+'<br /><strong>action :</strong> rating');
                            $('.serverResponse p').html('<strong>Loading...</strong>');*/
                            /** END ONLY FOR THE DEMO **/
                            $.post(opts.action,
                                "fileId="+document.getElementById("musicId").getAttribute("value")+"&rate="+rate,
                                function(data) {
                                    if(!data.error)
                                    {
                                        /** ONLY FOR THE DEMO, YOU CAN REMOVE THIS CODE **/
//                                        $('.serverResponse p').html(data.server);
                                        /** END ONLY FOR THE DEMO **/


                                        /** Here you can display an alert box,
                                         or use the jNotify Plugin :) http://www.myqjqueryplugins.com/jNotify
                                         exemple :	*/
                                        if(opts.onSuccess) opts.onSuccess( data, rate );
                                    }
                                    else
                                    {

                                        /** ONLY FOR THE DEMO, YOU CAN REMOVE THIS CODE **/
//                                        $('.serverResponse p').html(data.server);
                                        /** END ONLY FOR THE DEMO **/

                                        /** Here you can display an alert box,
                                         or use the jNotify Plugin :) http://www.myqjqueryplugins.com/jNotify
                                         exemple :	*/
                                        if(opts.onError) opts.onError( element, rate );
                                    }
                                },
                                'text'
                            );
                        }
                    });

                function getNote(relativeX) {
                    var noteBrut = parseFloat((relativeX*100/widthRatingContainer)*opts.rateMax/100);
                    switch(opts.decimalLength) {
                        case 1 :
                            var note = Math.round(noteBrut*10)/10;
                            break;
                        case 2 :
                            var note = Math.round(noteBrut*100)/100;
                            break;
                        case 3 :
                            var note = Math.round(noteBrut*1000)/1000;
                            break;
                        default :
                            var note = Math.round(noteBrut*1)/1;
                    }
                    return note;
                };

                function getStarWidth(){
                    switch(opts.type) {
                        case 'small' :
                            starWidth = 12; // width of the picture small.png
                            starHeight = 10; // height of the picture small.png
                            bgPath = opts.smallStarsPath;
                            break;
                        default :
                            starWidth = 23; // width of the picture stars.png
                            starHeight = 20; // height of the picture stars.png
                            bgPath = opts.bigStarsPath;
                    }
                };

                function findRealLeft(obj) {
                    if( !obj ) return 0;
                    return obj.offsetLeft + findRealLeft( obj.offsetParent );
                };
            });

    }
})(jQuery);

//给url地址加上时间戳,骗过浏览器,不读取缓存
function convertURL(url){
    //获取时间戳
    var timetamp = (new Date()).valueOf();
    //将时间戳信息拼接到url中
    if(url.indexOf("?") >= 0){
        url = url + "&t=" + timetamp;
    }else{
        url = url + "?t=" + timetamp;
    }
    //url = "personAjax&t=11111"
    return url;
}